popular-articles-2025
公開日: 2026.01.02  | 更新日: 2026.01.02

2025年に最も人気だった記事ベスト10

2025年も残りわずかとなりました。今年もwentz-design.comをご覧いただきありがとうございます。

毎年恒例となりましたが、2025年に最も読まれた記事のランキングと、今年の振り返りをお届けします。今回は単純なPVランキングだけでなく、「じっくり読まれた記事」という新しい視点も加えてご紹介したいと思います。


2025年に最も読まれた記事TOP10

まずは、2025年に最もアクセスの多かった記事のランキングです。

1位:Figmaでテキストを縦書きに対応する方法

figma-text-vertical-alternates

Figmaでテキストを縦書きに対応する方法

今回はFigmaでテキストを縦書きに対応する方法を紹介します。和風のWebサイトや広告バナー・フライヤーなどをデザインする際に、縦書きのテキストを配置したりできるようになるので、制作の幅も広がると思います。 ... 続きを読む

日本語でUIをデザインする際に避けて通れない縦書き対応。Figmaでの縦書きテキストの実現方法を解説した記事が、今年も堂々の1位となりました。日本のデザイナーならではのニーズを捉えた記事として、多くの方に参照いただいています。

2位:Figmaでグリッドやガイド(ルーラー)を表示・非表示する方法

figma-ruler-and-grid-view-tips

Figmaでグリッドやガイド(ルーラー)を表示・非表示する方法

今回はFigmaでルーラー(定規)やグリッド(升目)を表示・非表示したり、アウトライン表示などの見た目を切り替える方法を紹介します。ガイドを作成したい場合や、誤ってショートカットキーを押してしまって元に戻したい時などの参考になればと思います。 ... 続きを読む

デザイン作業の基本となるグリッドとガイドの操作方法。シンプルな内容ですが、Figmaを使い始めた方が最初につまずきやすいポイントでもあり、継続的にアクセスをいただいています。

3位:Figmaのオートレイアウトの基本的な使い方

figma-how-to-use-auto-layout

Figmaのオートレイアウトの基本的な使い方

今回は、Figmaを代表する機能のひとつである「オートレイアウト(Auto layout)」の基本的な使い方を、シンプルな画面レイアウトを実際に作りながら紹介します。また、この記事内で作成した画面レイアウトのサンプルファイルを公開・配布していますので、自由にご利用ください。 ... 続きを読む

オートレイアウトはFigmaの中核機能のひとつ。基本的な使い方から応用テクニックまでをまとめた記事が、今年も上位にランクインしました。

4位:Figmaで画像を○や□などの好きな形に切り抜く方法

figma-how-to-crop-and-mask

Figmaで画像を○や□などの好きな形に切り抜く方法

Figmaで画像をトリミングしたり、好きな形にくり抜く方法の紹介です。アプリのユーザーアイコンをデザインする際に円形にくり抜いたり、WEBやスライド資料などに差し込む画像の加工などに便利です。 ... 続きを読む

マスク機能を使った画像の切り抜き方法を解説した記事です。プレゼン資料やバナー制作など、さまざまな場面で役立つテクニックとして人気を集めています。

5位:Figmaでシンプルなテーブル(表)を作る方法

figma-how-to-create-table

Figmaでシンプルなテーブル(表)を作る方法

今回は、Figmaでシンプルなテーブル(表)を作る方法を紹介します。ヘッダーと罫線だけのシンプルな表を、「Component」と「Auto Layout」を使って丁寧に作成します。また、自由に使えるサンプルファイルも用意していますので、よかったらご活用ください。 ... 続きを読む

テーブルUIの作成は、特にB2B向けプロダクトのデザインでは頻出する作業。オートレイアウトを活用した効率的なテーブルの作り方を紹介しています。

6位:Figmaで写真やイラストの背景を簡単に切り抜き・透過する方法

figma-remove-bg-plugin

Figmaで写真やイラストの背景を簡単に切り抜き・透過する方法

今回は、Figmaで画像から背景を簡単に切り抜いてくれるプラグイン「Remove BG」の紹介です。画像を組み合わせてコラージュ画像を作りたい時や、写真から人物を抜き出したい時などに便利なプラグインです。 ... 続きを読む

背景の切り抜きは、以前はPhotoshopなどの画像編集ソフトが必要でしたが、Figmaのプラグインを使えば簡単に実現できます。この手軽さが支持されているようです。

7位:Figmaで簡単にフローチャートや画面遷移図をつくる方法

figma-connect-with-arrows

Figmaで簡単にフローチャートや画面遷移図をつくる方法

今回は、Figmaで図形やフレームを追従する矢印でつないで、簡単にフローチャートや画面遷移図をつくる方法を紹介します。サイトマップ作成やアプリケーションのUXを検討する際に、画面同士を矢印で繋ぐことで動線を検討したり、概念モデルを整理するのに役立ちます。 ... 続きを読む

画面遷移図やフローチャートの作成方法を解説した記事。設計段階での情報整理に役立つとして、継続的に読まれています。

8位:Figmaで曲線パスに沿って文字やシェイプをはわせる方法

figma-to-path-plugin

Figmaで曲線パスに沿って文字やシェイプをはわせる方法

今回はFigmaで曲線パスに沿って文字やシェイプ(パーティクル)を配置させる方法を紹介します。Figmaの標準の機能では手作業で一つずつ配置する必要があるので、「To Path」というプラグインを使用します。 ... 続きを読む

曲線に沿ったテキスト配置は、ロゴやバナー制作で使えるテクニック。プラグインを活用した方法を紹介しています。

9位:Figmaでオブジェクトや画像にぼかしを入れる方法

figma-how-to-use-blur-effect

Figmaでオブジェクトや画像にぼかしを入れる方法

今回は、Figmaでオブジェクトや画像をぼかす「Layer blur」機能を使って、グラフィック作成に活用できる便利なテクニックをいくつかご紹介します。プラグインと組み合わせると、Photoshopを使ったような高度なグラフィックも制作できますので、覚えておいて損はないです。 ... 続きを読む

ぼかし効果の適用方法を解説した記事。背景のぼかしやフロストグラス効果など、UIデザインでよく使われる表現技法をまとめています。

10位:Figmaでヘッダーを画面上部に固定して追従させる(プロトタイプ)

figma-header-sticky-animation-prototype

Figmaでヘッダーを画面上部に固定して追従させる(プロトタイプ)

今回はFigmaのプロトタイプ(Prototype)機能を利用して、画面レイアウト上のヘッダーコンポーネントを、画面スクロール時に画面上部に固定して追従するようなアニメーションの設定方法を紹介します。設定されたサンプルファイルも公開していますので、自由に利用してください。 ... 続きを読む

スクロールに追従するヘッダーのプロトタイプ実装方法。実際のアプリの挙動を再現したプロトタイプを作りたいというニーズに応える記事です。

今年もFigma関連の記事が上位を占める結果となりました。特に「縦書き対応」や「テーブル作成」など、日本のデザイナーが実務で直面する具体的な課題を解決する記事が支持されていることがわかります。

今年「じっくり読まれた」記事たち

ここからは、少し違った視点でのご紹介です。

PVランキングでは見えてこない「読者がじっくり時間をかけて読んでくれた記事」があります。アクセス数は多くなくても、訪れた方が長い時間をかけて読み込んでくれた記事。それはある意味で、読者の心に響いた記事とも言えるのではないでしょうか。

今年、特に熟読された記事をいくつかご紹介します。

プロダクトデザインにおけるユーザーインタビューの目的と設計プロセス

product-design-interview-tips

プロダクトデザインにおけるユーザーインタビューの目的と設計プロセス

今回は、プロダクトデザインのプロセスにおけるユーザーインタビューの位置付けと、具体的な設計手法、そして実践のコツについてまとめます。 ... 続きを読む

ユーザーインタビューの目的設定から、質問設計、実施時の心構えまでを体系的にまとめた記事です。インタビューは「聞けば答えが返ってくる」というシンプルなものではなく、適切な問いの設計と、相手の言葉の奥にある真意を読み取る姿勢が求められます。プロダクトデザイナーとして避けて通れないスキルを、実践的な視点からまとめました。

ゲシュタルト原則の7つの法則とUIデザインへの応用

gestalt-principles-ui-design

ゲシュタルト原則の7つの法則とUIデザインへの応用

優れたUIは、どのような考え方によって生み出されるのでしょうか。特に、道具としてのUIを考える上では、美しい見た目ももちろん重要ですが、それ以上に「ユーザーが新しく考えなくても、使い方がわかる」ことが大事なように思われます。 ... 続きを読む

人間の知覚がどのようにまとまりを認識するかを説明するゲシュタルト原則。「近接」「類同」「閉合」といった法則を、UIデザインの具体例と結びつけて解説しました。なぜそのレイアウトが「見やすい」と感じるのか、その背景にある認知の仕組みを理解することで、デザインの説得力が変わってきます。

ワークショップデザインのレポートまとめ

wsd41-reports

ワークショップデザインのレポートまとめ

この記事は、青山学院大学大学院主催のワークショップデザイナー育成プログラムの課題として、動画形式の講座を受講して筆者個人の考えをまとめたレポートのまとめです。 ... 続きを読む

2024年度に受講したワークショップデザイナー育成プログラムでの学びをまとめた連載記事です。ワークショップの設計手法やファシリテーションの技術は、チームでのデザイン活動やステークホルダーとの合意形成にも応用できます。全16回のレポートを通じて、学びの過程を共有しました。

メンタルモデル不在のUIがユーザーに受け入れられない理由

why-ui-without-mental-model-fails

メンタルモデル不在のUIがユーザーに受け入れられない理由

この記事では、プロダクトの成否を静かに左右する「メンタルモデル」とは何か、それがユーザー体験、特に情報設計にどう影響するのか、そしてデザイナーはそれをどう扱っていくべきかについて、先人の知識(書籍)の力を借りながら掘り下げてみます。 ... 続きを読む

ユーザーが持つ「こう動くはずだ」という期待(メンタルモデル)と、実際のUIの挙動がずれたとき、使いにくさや混乱が生じます。この記事では、メンタルモデルの概念と、それを意識したUI設計のポイントを解説しました。

なぜあなたのデザイン案は却下されるのか

why-your-design-is-rejected

なぜあなたのデザイン案は却下されるのか

この記事では、デザイナーが直面する「デザイン案が評価されない」という課題を乗り越えるための実践的なヒントを提供できればと思います。ここで紹介するコミュニケーション技術を習得することで、プロジェクトにおけるプレゼンス向上の足掛けになればと思います。 ... 続きを読む

デザイナーが作った案がレビューで却下される。その原因は、デザインの良し悪しだけでなく、「なぜこのデザインなのか」という説明の仕方や、ステークホルダーとの期待値の擦り合わせにあることも多いです。デザインを通すための「伝え方」について考察しました。

タスク先延ばし撲滅の現実解としての「期限設定」の手引き

deadline-task-management-for-designers-developers

タスク先延ばし撲滅の現実解としての「期限設定」の手引き

いつも「やらなきゃ」と思いながらも実行できない自分に苛立つことはありませんか?私はあります。今日は、タスク管理において個人的に最強の動機づけになると考えているタスクの「期限管理」について、私の実践知をもとに説明してみようと思います。 ... 続きを読む

デザイナーやエンジニアが陥りがちな「先延ばし」問題。完璧を求めるあまり手が止まってしまう、優先順位がつけられない…。そんな課題に対して、「期限を設定する」というシンプルだけど効果的なアプローチを提案しました。

B2Bのデジタルプロダクトデザイナーはどのようにキャリアを作っていくのか?

b2b-digital-product-designer-career

B2Bのデジタルプロダクトデザイナーはどのようにキャリアを作っていくのか?

この記事は、B2B SaaSのプロダクトデザイナーを目指したいと思っている方に向けて、キャリアパスと必要なスキルについて言語化を試みるものです。 ... 続きを読む

toC向けサービスと比較して、B2B領域のプロダクトデザイナーのキャリアパスは見えにくいことがあります。ドメイン知識の蓄積、ステークホルダーとの関係構築、長期的な価値提供…。B2Bデザイナーならではのキャリア形成について、自分なりの考えをまとめました。

「教養としての認知科学」を読んで

book-review-250405

「教養としての認知科学」を読んで

人間の思考や記憶のメカニズムを理解することは、自分自身を知り、より効果的に学び、考えるための重要な一歩になると思います。今回は、鈴木宏昭氏の著書『教養としての認知科学』を読んだので、その内容と私の感想、そして読んで良かったと思える学びを紹介します。 ... 続きを読む

認知科学の入門書を読んでの学びをまとめた読書メモです。人間がどのように情報を処理し、判断し、行動するのか。その仕組みを知ることは、ユーザーの行動を理解し、より良いUIを設計するための基盤になります。

これらの記事に共通しているのは、「Figmaの操作方法」のような即効性のあるTipsではなく、デザイナーとしての考え方や、キャリア、認知科学といった「思考の土台」に関わるテーマだということです。

読者の方が時間をかけて読んでくださっているということは、こうした内容に関心を持っていただけているのだと受け止めています。

2026年に向けて

今年も多くの方にwentz-design.comをご覧いただき、ありがとうございました。

2025年は、Figmaの実践的なTipsを発信しつつ、マネジメント、キャリア、デザインプロセス、認知科学といったテーマの記事も少しずつ増やしてきました。

来年2026年は、この方向性をさらに強化していきたいと考えています。

デザインツールの使い方はもちろん大切ですが、それだけでは解決できない課題がたくさんあります。チームでどうデザインを進めるか、ステークホルダーとどう合意形成するか、デザイナーとしてどうキャリアを築いていくか。そうした「デザイナーの仕事そのもの」に関わるテーマを、引き続き探求し、発信していきます。

Figma記事で培った「わかりやすく、シンプルに、なるはやで」というスタイルはそのままに、より深いテーマにも挑戦していく1年にしたいと思います。

2026年もwentz-design.comをよろしくお願いいたします。

今回は、デスクまわりの作業環境を少しずつ整えてきた中で、実際に使っていて満足度の高かったアイテムをまとめて紹介します。

最新の記事を見る
広告
この記事を書いた人
うえんつ
B2B領域のSaaS・アプリケーション開発などを組織で取り組むことが得意なプロダクトデザイナーで、このブログのオーナーです。
今の関心事
Figma・UIデザイン・UXリサーチ・QOL・旅行
今回は、デスクまわりの作業環境を少しずつ整えてきた中で、実際に使っていて満足度の高かったアイテムをまとめて紹介します。
広告